<template>
  <div class="job-detail-page">
    <!--    <van-nav-bar title="职位详情" left-arrow @click-left="toBack" v-show="$route.path === '/jobDetail'" /> -->

    <van-nav-bar title="职位详情" left-arrow @click-left="toBack">
      <template #right>
        <van-icon name="ellipsis" size="18" @click="showOverlay = true" />
      </template>
    </van-nav-bar>

    <van-overlay :show="showOverlay" @click="showOverlay = false" class-name="over_layer">
      <van-cell-group class="layer">
        <van-cell @click="report()" value="举报" />
        <van-cell @click="cope()" value="复制分享链接" />
        <van-cell @click="copeInfo()" value="复制招聘信息" />
        <van-cell @click="copeUrl()" value="复制招聘链接" />
      </van-cell-group>
    </van-overlay>

    <van-overlay :show="showLine" @click="showLine = false" class-name="over_layer">
      <van-cell-group class="layerLine">
        <van-cell value="线下报名渠道来源" @click="lineBM(needObj,5)"/>
        <van-cell value="报到点名"  @click="lineBM(needObj,6)"/>
        <van-cell value="接送点名" @click="lineBM(needObj,7)"/>
        <van-cell value="到用企点名" @click="lineBM(needObj,8)"/>
        <van-cell value="分宿舍点名" @click="lineBM(needObj,9)"/>
        <van-cell value="培训点名" @click="lineBM(needObj,10)"/>
        <van-cell value="合同协议" @click="lineBM(needObj,11)"/>
      </van-cell-group>
    </van-overlay>

    <div class="detailCard">
      <com-job-item :com_type='com_type' :status="0" :jobItem="needObj" :keyWord="'home'" :serchType="1" :routeName="$route.name"></com-job-item>

      <div v-show="needObj.videos || needObj.photos.length">
        <van-divider
          :style="{
            color: '#020202',
            borderColor: '#DD4F42',
            padding: '10px 66px',
            margin: '0'
          }"
        >
          工作照片、视频
        </van-divider>
        <div style=" width:100%; height:160px; vertical-align: bottom;">
          <van-swipe :autoplay="2000" class="swipeImg" indicator-color="white" v-if="needObj.photos.length">
            <van-swipe-item v-for="(image, index) in needObj.photos" :key="index">
              <van-image
                lazy-load
                :src="image"
                height="160"
                class="imgrender"
                fit="cover"
                @click="toPreviewImage(needObj.photos)"
              />
            </van-swipe-item>
          </van-swipe>
        </div>
        <!--  上传视频   -->
        <com-video-list :videoStr="needObj.videos" :title="'视频：'" v-show="needObj.videos" />
      </div>

      <!--  滚动切换的Tab    -->
      <van-tabs v-model="activeTab" class="detailDesc" scrollspy sticky color="#1989fa" swipe-threshold="4">
        <van-tab title="基础信息">
          <div>
            <van-divider
              :style="{
                color: '#020202',
                borderColor: '#DD4F42',
                padding: '10px 66px',
                margin: '0'
              }"
              >基础信息</van-divider
            >
            <van-cell-group>
              <quillEditor v-if='needObj.job_content' :jobContent="needObj.job_content.replace(/\?|\>|\/|\?]/g, '')" :isDisable="true"></quillEditor>
              <!-- <van-cell title="招聘详情" type="textarea" rows="4" /></van-cell> -->
              <!-- <van-cell title="企业名称" :value="needObj.enterprise_name" />
              <van-cell title="招聘信息" :value="needObj.recruiting_position" />
              <van-cell title="招聘人数" :value="needObj.recruiting_numbers" />
              <van-cell title="工作时间" :value="needObj.work_days" />
              <van-cell title="休息时间" :value="needObj.res_days" /> -->
              <!-- <van-cell title="职位属性" :value="positionIdObj[needObj.position_id]" /> -->
              <!-- <van-cell title="班制属性" :value="classAttributeIdObj[needObj.class_attribute_id]" /> -->
              <!-- <van-cell title="上班是否可带手机" :value="needObj.iswithphone * 1 === 1 ? '可带' : needObj.iswithphone * 1 === 2 ? '不可带' : ''" /> -->
              <!-- <van-cell title="上班是否穿无尘服" :value="needObj.iswearcleanclothes * 1 === 1 ? '必须穿' : needObj.iswearcleanclothes * 1 === 2 ? '不穿' : ''" /> -->
              <!-- <van-cell title="入职是否体检" :value="needObj.vision == 0 ? '体检' : needObj.vision == 1?'不体检':'' " /> -->
              <!-- <van-cell title="工作内容" :value="needObj.job_content" />
              <van-cell title="工作环境" :value="needObj.job_environment" />
              <van-cell title="矿工说明" :value="needObj.completion_instruction_description" />
              <van-cell title="自离说明" :value="needObj.self_explanation_description" />
              <van-cell title="辞职说明" :value="needObj.resignation_instructions_description" />
              <van-cell title="其他说明" :value="needObj.other_description" /> -->
            </van-cell-group>
          </div>
        </van-tab>
        <!-- <van-tab title="薪资福利">
          <div>
            <van-divider :style="{color: '#020202', borderColor: '#DD4F42', padding: '10px 66px', margin: '0'}"
              >薪资福利</van-divider
            >
            <van-cell-group>
              <van-cell title="算薪方式" :value="payMoneyModeObj[needObj.payway_id]" />
              <van-cell :title="payMoneyModeObj[needObj.payway_id]" :value="computedPayMoneyValue" />

              <van-cell
                title="综合工资"
                :value="needObj.min_comprehensive_salary + ' — ' + needObj.max_comprehensive_salary"
              />
              <van-cell title="每周可借支的金额" :value="`${needObj.lend_money_amount || 0} 元`" />
              <van-cell
                title="发薪日"
                :value="
                  paydayIdObj[needObj.payday] +
                    (needObj.pay_money_detail_date ? '，' + needObj.pay_money_detail_date : '')
                "
              />
              <van-cell title="福利">
                <template #default v-if="needObj.other_benefits">
                  <span v-for="(item,index) in needObj.other_benefits.split(',')" :key='index'>
                    {{
                      item == 1 ? '包吃' :
                      item == 2 ? '供吃' :
                      item == 3 ? '饭补' :
                      item == 4 ? '社保' :
                      item == 5 ? '保险' :
                      item == 6 ? '包住' :
                      item == 7 ? '供住' :
                      item == 8 ? '住房补贴 / 房补' :
                      item == 9 ? '住房公积金' :
                      item == 10 ? '奖金' :
                      item == 11 ? '通讯补助 / 话补' :
                      item == 12 ? '交通补助 / 车补' : ''
                    }}
                  </span>
                </template>
              </van-cell>
            </van-cell-group>

          </div>
        </van-tab> -->
        <!-- <van-tab title="录用条件">
          <div>
            <van-divider :style="{color: '#020202', borderColor: '#DD4F42', padding: '10px 66px', margin: '0'}"
              >录用条件</van-divider
            >
            <van-cell-group>
              <van-cell title="学历" :value="computedEducations" />
              <van-cell title="工作经验" :value="workingLifeIdObj[needObj.working_lifes_id]" />
              <van-cell title="证件类型" :value="computedCertificateTypes" />
            </van-cell-group>
          </div>
        </van-tab> -->
        <!-- <van-tab title="入职材料">
          <div>
            <van-divider :style="{color: '#020202', borderColor: '#DD4F42', padding: '10px 66px', margin: '0'}"
              >入职材料</van-divider
            >
            <van-cell-group>
              <van-cell title="身份证复印件数量" :value="needObj.id_card_num" />
              <van-cell title="银行卡复印件数量" :value="needObj.bank_card_num" />
              <van-cell title="照片颜色尺寸和数量" :value="needObj.photo_color_size_quantity" />
              <van-cell title="随身行李" :value="needObj.personal_bags" />
              <van-cell title="体检费" :value="needObj.medical_examination_fee" />
              <van-cell title="其他材料" :value="needObj.other_materials" />
            </van-cell-group>
          </div>
        </van-tab> -->
        <van-tab title="定位与时间">
          <div>
            <van-divider :style="{color: '#020202', borderColor: '#DD4F42', padding: '10px 66px', margin: '0'}"
              >定位与时间</van-divider
            >
            <van-cell-group>
              <van-cell title="联系人" :value="needObj.contact" />
              <van-cell title="手机号" :value="needObj.phone" @click="phoneContact(needObj.phone)" is-link />
              <!--
              <van-cell title="微信号" :value="needObj.wechat" @click="doCopy(needObj.wechat)" is-link />
              <van-cell title="QQ号" :value="needObj.qq" />

              -->

              <van-cell :value="needObj.zq_address" is-link @click="toMapPage(needObj, needObj.zq_address)">
                <!-- 使用 title 插槽来自定义标题 -->
                <template #title>
                  <span class="custom-title">招企地址</span>
                  <van-icon name="location-o" size="18" />
                </template>
              </van-cell>

              <van-cell
                :value="needObj.interview_address_fulle_address"
                is-link
                @click="toMapPage(needObj, needObj.interview_address_fulle_address)"
              >
                <!-- 使用 title 插槽来自定义标题 -->
                <template #title>
                  <span class="custom-title">面试地址</span>
                  <van-icon name="location-o" size="18" />
                </template>
              </van-cell>

              <!-- <van-cell title="面试时间" :value="needObj.application_time" /> -->

              <van-cell
                :value="needObj.work_address_fulle_address"
                is-link
                @click="toMapPage(needObj, needObj.work_address_fulle_address)"
              >
                <!-- 使用 title 插槽来自定义标题 -->
                <template #title>
                  <span class="custom-title">上班地址</span>
                  <van-icon name="location-o" size="18" />
                </template>
              </van-cell>
              <!-- <van-cell title="车费报销" :value="needObj.car_fare_reimbursement" /> -->
              <van-cell v-if="com_type == 1" title="代招费" :value="needObj.generation_of_commission + feeUnitObj[needObj.fee_unit]" />
              <van-cell v-if="com_type == 1" title="代招说明" :value="needObj.generation_instructions" />
              <van-cell
              v-if="com_type == 1"
                title="下游合作费"
                :value="needObj.downstream_cooperation_fee + feeUnitObj[needObj.cooperation_fee_unit]"
              />
              <van-cell v-if="com_type == 1" title="下游合作费说明" :value="needObj.downstream_cooperation_fee_desc" />
            </van-cell-group>
          </div>
        </van-tab>

        <van-tab
          title="上游备注"
          v-if="needObj.creator_user_id === allUserInfo.id || this.$route.query.keyword === 'jobSheet'"
        >
          <div>
            <van-divider :style="{color: '#020202', borderColor: '#DD4F42', padding: '10px 36px', margin: '0'}">
              上游招聘信息备注（仅自己可见）
            </van-divider>
            <van-cell title="文字备注" :value="needObj.job_notes || '无'" />
            <van-row class="notes_photos" type="flex" justify="space-between">
              <van-col span="5">
                <span>图片备注</span>
              </van-col>
              <van-col span="19" class="content_pic">
                <div v-if="needObj.notes_photos">
                  <van-uploader
                    v-model="needObj.notes_photos.split(',').map(urlPath => ({url: urlPath}))"
                    :deletable="false"
                    :show-upload="false"
                    :preview-options="{closeable: true}"
                  />
                </div>
                <span v-else>无</span>
              </van-col>
            </van-row>
            <!--  视频备注           -->
            <com-video-list :videoStr="needObj.notes_videos" />
          </div>
        </van-tab>
      </van-tabs>

      <div class="warn">
        <div class="title">温馨提示：</div>
        <div class="content">招聘信息不符合实际的，需谨慎并及时举报，谢谢。</div>
      </div>
      <!--  用于占位   -->
      <div style="height: 56px; visibility: hidden"></div>
    </div>

    <!-- 两端对齐 -->
    <van-row type="flex" justify="space-between" class="detail-footer">
      <van-col span="23" class="all_others">
        <van-row type="flex" justify="space-between" class="others_items">
          <van-col span="4" class="item" @click="tocompany(needObj.company_id)">
            <van-icon name="hotel-o" size="20" />
            <div>公司</div>
          </van-col>
          <van-col
            span="4"
            class="item"
            @click="servece_show = true"
          >
            <van-icon name="service-o" size="20" />
            <div>客服</div>
          </van-col>
          <!-- <van-col
            span="4"
            class="item"
            @click="toService(needObj.job_category_id, needObj.company_id, needObj.enterprise_name)"
          >
            <van-icon name="service-o" size="20" />
            <div>客服</div>
          </van-col> -->
          <van-col span="4" class="item" @click="toCollectJob(needObj.id, needObj.collect)">
            <van-icon
              :name="needObj.collect === 0 ? 'like-o' : 'like'"
              size="20"
              :color="needObj.collect === 0 ? 'inherit' : 'red'"
            />
            <div>收藏</div>
          </van-col>
          <!--          <van-col span="4" class="item" @click="share">
            <van-icon name="share-o" size="20" />
            <div>分享</div>
          </van-col>-->
          <van-col span="4" @click="phoneC(needObj.phone)" class="item">
            <van-icon name="phone-o" size="20" />
            <div>打电话</div>
          </van-col>
          <van-col span="4" @click="toSignUpJob(needObj.id,1)" class="item">
            <van-icon name="records" size="20" />
            <div :style="{color: computedWorkStatusColor}">{{ computedWorkStatusText }}</div>
          </van-col>
          <van-col span="4" @click="toSignUpJob(needObj.id,2)" class="item">
            <van-icon name="exchange" size="20" />
            <div>线下报名</div>
          </van-col>
        </van-row>
      </van-col>
    </van-row>

    <!-- 客服弹窗 -->
    <van-popup v-model="servece_show">
      <div class="other_serverce">
        <div class="title">第三方客服</div>
        <div class="mes_copy">
          <div>{{ needObj.phone }}</div>
          <div class="copy" @click="copy_tel(needObj.phone)">复制号码添加客服微信</div>
        </div>
      </div>
    </van-popup>


    <!-- 视频预览和播放   -->
    <com-video-preview :key="Math.random()"></com-video-preview>

    <van-share-sheet v-model="showShare" title="分享给好友" :options="shareOptions" @select="onSelectShare" />
  </div>
</template>

<script>
import {ImagePreview, Toast, Dialog} from 'vant'
import comJobItem from '../../components/comJobItem'
import logoImg from '../../assets/logo.png'
import wechatField from '../../assets/wechat-field.png'
import comVideoList from '../../components/comVideoList'
import comVideoPreview from '../../components/comVideoPreview'
import quillEditor from '../../components/quillEditor'
import {
  positionIdObj,
  classAttributeIdObj,
  paydayIdObj,
  workingLifeIdObj,
  educationsObj,
  certificateTypesObj,
  workStatus
} from '../../constants/comUtils'
import {getStringFromArray} from '../../constants/commonFunc'
import jobCategoryObj from '../../constants/jobCategoryObj'
import {payMoneyModeObj} from '../../constants/payMoneyMode'
import {feeUnitObj} from '../../constants/comUtils'
import {mapGetters} from 'vuex'
import router from '../../router'
import posterIMg from '../../assets/1.jpeg'

import {videoStr, imgStr} from '../../utils/mockData'

export default {
  name: 'jobDetail',
  components: {
    comJobItem,
    comVideoList,
    comVideoPreview,
    quillEditor
  },
  data() {
    return {
      servece_show:false,
      videoStr,
      logoImg,
      showShare: false,
      shareOptions: [
        [
          {name: '微信', icon: 'wechat'},
          {name: '朋友圈', icon: wechatField},
          {name: '微博', icon: 'weibo'},
          {name: 'QQ', icon: 'qq'}
        ],
        [
          {name: '复制链接', icon: 'link'},
          {name: '分享海报', icon: 'poster'},
          {name: '二维码', icon: 'qrcode'},
          {name: '小程序码', icon: 'weapp-qrcode'}
        ]
      ],
      positionIdObj,
      classAttributeIdObj,
      payMoneyModeObj,
      paydayIdObj,
      workingLifeIdObj,
      educationsObj,
      certificateTypesObj,
      feeUnitObj,
      showOverlay: false,
      showLine:false,
      activeTab: 0,
      needObj: {
        photos: [],
        educations: [],
        certificate_type: []
      },
      jobId: '',
      com_type:''
    }
  },

  created() {
    if (this.$route.query.id) {
      this.jobId = this.$route.query.id
    } else {
      this.$router.back()
    }
  },

  computed: {
    ...mapGetters(['allUserInfo']),
    computedWorkStatusColor() {
      switch (this.needObj.apply) {
        case 0:
          return '#000000'
        case 1:
          return '#36D7B7'
        case 2:
          return '#07C160'
        case 3:
          return '#FF976A'
        default:
          return '#1989FA'
      }
    },
    // todo 是否需要调整？？？？
    computedWorkStatusText() {
      switch (this.needObj.apply) {
        case 1:
          return '已报名'
        case 2:
          return '工作中'
        case 3:
          return '已离职'
        default:
          return '点击报名'
      }
    },
    computedPayMoneyValue() {
      if (this.needObj.second_value_input && this.needObj.third_value_input) {
        return (
          this.needObj.first_value_input +
          ' + ' +
          this.needObj.second_value_input +
          ' + ' +
          this.needObj.third_value_input
        )
      } else if (this.needObj.second_value_input) {
        return this.needObj.first_value_input + ' + ' + this.needObj.second_value_input
      } else {
        return this.needObj.first_value_input
      }
    },
    computedEducations() {
      let res
      if (this.needObj.educations.length && this.needObj.educations instanceof Array) {
        res = getStringFromArray(this.needObj.educations, this.educationsObj)
      } else {
        res = '数据异常！请联系客服'
      }
      return res
    },
    computedCertificateTypes() {
      let res2
      if (this.needObj.certificate_type.length && this.needObj.certificate_type instanceof Array) {
        res2 = getStringFromArray(this.needObj.certificate_type, this.certificateTypesObj)
      } else {
        res2 = '数据异常！请联系客服'
      }
      return res2
    }
  },

  mounted() {
    const {keyword} = this.$route.query
    this.com_type = this.$route.query.com_type
    if (keyword === 'jobSheet') {
      this._getJobDetailObj_sheet()
    } else {
      this._getJobDetailObj()
    }

    let allCertificate = window.localStorage.getItem('allCertificate')
    if (allCertificate) {
      // 个人认证的最新值
      this.$store.dispatch('getUserAllInfo')
    }
  },

  methods: {
    // 复制招聘信息
    copeInfo(){
      console.log(this.needObj.job_content)
      this.$copyText(this.needObj.job_content).then(
          function(e) {
            Toast.success('复制成功')
          },
          function(e) {
            Toast.fail('复制出错')
          }
        )
    },
    // 复制招聘链接
    copeUrl(){
      this.$copyText(window.location.href).then(
          function(e) {
            Toast.success('复制成功')
          },
          function(e) {
            Toast.fail('复制出错')
          }
        )
    },
    //第三方客服弹窗
    // 复制
    copy_tel(val){
      let _self = this
      _self.$copyText(val).then(
          function(e) {
            Toast.success('已复制')
            _self.servece_show = false
          },
          function(e) {
            Toast.fail('复制出错了')
          }
        )
      },
    lineBM(needJob,number){
      // window.location.href = 'http://www.jinpin.love/#/qode?'+'&qodeType='+number+'&job_id='+needJob.id
      this.$router.push({
          path: '/qode',
          query: {
            qodeType: number,
            job_id: needJob.id,
          }
        })
      // if (this.allUserInfo.id) {
      //   res = qrcodeUrls + `?qodeType=${number}&job_id=${needJob.id}`
      // } else {
      //   res = this.linkUrl_code
      // }
    },
    onSelectShare(optionItem, index) {
      Toast(optionItem.name)
      this.showShare = false
    },
    report() {
      let allCertificate = window.localStorage.getItem('allCertificate')
      // allUserInfo.certification_state === 2
      // allUserInfo.company_certification_state === 2
      // 有登录凭证才能看到
      if (allCertificate && this.allUserInfo.certification_state === 2) {
        this.$router.push({
          path: '/complaint',
          query: {
            company_id: this.needObj.company_id,
            job_id: this.needObj.id,
            title: '举报'
          }
        })
      } else {
        this.$store.dispatch('logOut')
        Dialog.confirm({
          message: '此功能需要注册登入才能使用，为您跳转到注册登入页面。'
        })
          .then(() => {
            this.$router.push({
              path: '/login',
              query: {
                redirect: this.$router.currentRoute.fullPath
              }
            })
          })
          .catch(() => {
            // on cancel
          })
      }
    },
    toService(category_id, companyId, companyName) {
      // 其他代码是：13790143381,
      // this.showServiceDialogModal(this.needObj.wechat || '13790143381')
      // return null

      // todo 上线待讨论，是否下线客服需求？
      let _self = this
      let allCertificate = window.localStorage.getItem('allCertificate')
      let GetThreeManualServiceList = window.localStorage.getItem('GetThreeManualServiceList')
      console.log(JSON.parse(GetThreeManualServiceList))
      console.log(companyId)
      let companyInfo = JSON.parse(GetThreeManualServiceList)
      let companyDetail = {}
      for (var i = 0; i < companyInfo.length; i++) {
        if (companyId == companyInfo[i].CompanyId) {
          companyInfo[i].MessagePage = 'company'
          companyInfo[i].Name = '公司客服'
          companyInfo[i].category_id = category_id //求职类型
          companyInfo[i].enterprise_name = companyName //职位昵称
          companyInfo[i].id = _self.needObj.id //职位详情id
          companyInfo[i].sign_state = _self.needObj.sign_state
          companyInfo[i].sign_remark = _self.sign_remark
          companyDetail = companyInfo[i]
          companyInfo[i].detailLink = window.location.href
        }
      }

      // 有登录凭证才能看到
      if (allCertificate) {
        this.signaR.getMessage(companyDetail)
        this.$router.push({name: 'chat', params: companyDetail})
        // this.$router.push({name: 'chat', params: {keyLink:"link"}})
      } else {
        // this.$store.dispatch('logOut')
        // Toast('此功能需要注册登入才能使用，请先登录！')
        Dialog.confirm({
          title: '温馨提示',
          message: '此功能需要注册登入才能使用，为您跳转到注册登入页面。',
          messageAlign: 'left'
        })
          .then(() => {
            this.$router.push({
              path: '/login',
              query: {
                redirect: this.$router.currentRoute.fullPath
              }
            })
          })
          .catch(() => {
            // on cancel
          })
      }
    },

    // 客服弹窗
    showServiceDialogModal(telephone) {
      let allCertificate = window.localStorage.getItem('allCertificate')
      if (allCertificate) {
        Dialog.confirm({
          title: '提示',
          message: '请添加该招聘企业的客服微信号进行咨询。',
          messageAlign: 'left',
          confirmButtonText: '复制微信号'
        })
          .then(() => {
            this.doCopy(telephone)
          })
          .catch(() => {
            // on cancel
          })
      } else {
        this.$store.dispatch('logOut')
        Dialog.confirm({
          message: '此功能需要注册登入才能使用，为您跳转到注册登入页面。'
        })
          .then(() => {
            this.$router.push({
              path: '/login',
              query: {
                redirect: this.$router.currentRoute.fullPath
              }
            })
          })
          .catch(() => {
            // on cancel
          })
      }
    },

    share() {
      wx.onMenuShareQQ({
        title: '', // 分享标题
        desc: '', // 分享描述
        link: '', // 分享链接
        imgUrl: '', // 分享图标
        success: function() {
          // 用户确认分享后执行的回调函数
        },
        cancel: function() {
          // 用户取消分享后执行的回调函数
        }
      })
    },
    phoneC(phoneNumber) {
      let allCertificate = window.localStorage.getItem('allCertificate')
      if (allCertificate) {
        window.location.href = `tel:${phoneNumber}`
      } else {
        this.$store.dispatch('logOut')
        Dialog.confirm({
          message: '此功能需要注册登入才能使用，为您跳转到注册登入页面。'
        })
          .then(() => {
            this.$router.push({
              path: '/login',
              query: {
                redirect: this.$router.currentRoute.fullPath
              }
            })
          })
          .catch(() => {
            // on cancel
          })
      }
      // window.location.href = 'tel://' + phoneNumber
    },
    async _getJobDetailObj() {
      let _self = this
      const res = await this.$api.job.reqJobDetailObj(this.jobId)
      if (res.code === 200) {
        _self.needObj = res.data
      }
    },

    async _getJobDetailObj_sheet() {
      const res = await this.$api.others.reqJobSheetDetailObj(this.jobId)
      if (res.code === 200) {
        this.needObj = res.data
      }
    },

    async toSignUpJob(id,type) {
      console.log(this.needObj, 'needObj')
      let allCertificate = window.localStorage.getItem('allCertificate')
      const {sign_state, sign_remark} = this.$route.query
      console.log('sign_state父组件传值', sign_state, sign_remark)
      // 有登录凭证才能看到
      if (allCertificate) {
        if (this.allUserInfo.certification_state === 2) {
          console.log('个人信息', this.allUserInfo)
          // 认证全部通过后
          if (+sign_state === 1) {
            // !个人账户异常接口  //如果被限制 不能报名
            Dialog.confirm({
              title: '企业账号被举报，导致账号异常',
              message: sign_remark || '当前招聘异常',
              messageAlign: 'left',
              confirmButtonText: '请联系近聘客服'
            })
              .then(() => {
                // console.log('customerService')
                // this.$router.push('/customer_service')
                this.$router.push({
                  name: 'customer_service'
                })
              })
              .catch(() => {
                // on cancel
              })
          } else {
            if(type == 1){//报名
                if (+this.needObj.apply === 0) {
                  // 如果当前职位限制报名, 则不能报名
                  if (this.needObj.handle_state === 1) {
                    Toast(`当前职位已经被限制! 无法报名!`)
                    return
                  }
                  // todo 有了工作状态，则不可再次报名
                  const params = {
                    job_id: id
                  }
                  const res = await this.$api.job.reqJobApply(params)
                  if (res.code === 200) {
                    Toast.success('报名成功')
                    await this._getJobDetailObj()
                  }
                } else {
                  Toast(`当前是${workStatus[this.needObj.apply]}, 不可再次报名！`)
                }
            }else{//线下报名
                this.showLine = true
            }

          }
        } else if (this.allUserInfo.certification_state === 0) {
          Dialog.confirm({
            title: '尚未个人认证！',
            message:
              '工作报名需要个人认证！你当前还没有进行个人认证，无法报名。请点击去个人认证。点击之前，建议你先收藏该工作哦！',
            messageAlign: 'left',
            confirmButtonText: '去个人认证'
          })
            .then(() => {
              this.$router.push('/personalAuth')
            })
            .catch(() => {
              // on cancel
            })
        } else {
          Dialog.confirm({
            title: '个人认证未完成',
            message: '你的个人认证正在审核中，或者还没有通过。请点击去个人认证去查看。点击之前，建议你先收藏该工作哦！',
            messageAlign: 'left',
            confirmButtonText: '去个人认证'
          })
            .then(() => {
              this.$router.push('/personalAuth')
            })
            .catch(() => {
              // on cancel
            })
        }
      } else {
        this.$store.dispatch('logOut')
        Dialog.confirm({
          message: '此功能需要注册登入才能使用，为您跳转到注册登入页面。'
        })
          .then(() => {
            this.$router.push({
              path: '/login',
              query: {
                redirect: this.$router.currentRoute.fullPath
              }
            })
          })
          .catch(() => {
            // on cancel
          })
      }
    },
    toPreviewImage(photos) {
      ImagePreview({
        images: photos,
        closeable: true
      })
    },
    // 加_ 是便于分为事件回调函数、和一般函数
    toBack() {
      this.$router.back()
    },

    phoneContact(tel) {
      window.location.href = `tel:${tel}`
      this.doCopy(tel)
    },

    // 开始复制成功
    doCopy(phoneNum) {
      this.$copyText(phoneNum).then(
        function(e) {
          Toast('复制成功, 将联系方式粘贴到手机电话即可联系，或粘贴添加微信。')
        },
        function(e) {
          Toast('复制可能出错了，请拨打电话吧！')
          window.location.href = `tel:${phoneNum}`
        }
      )
    },

    async toCollectJob(id, val) {
      let allCertificate = window.localStorage.getItem('allCertificate')
      // 有登录凭证才能看到
      if (allCertificate) {
        const params = {
          job_id: id
        }
        const res = await this.$api.job.reqJobCollect(params)
        if (res.code === 200) {
          const msg = val === 0 ? '收藏成功' : '取消收藏'
          Toast.success(msg)
          this._getJobDetailObj()
        }
      } else {
        this.$store.dispatch('logOut')
        Dialog.confirm({
          message: '此功能需要注册登入才能使用，为您跳转到注册登入页面。'
        })
          .then(() => {
            this.$router.push({
              path: '/login',
              query: {
                redirect: this.$router.currentRoute.fullPath
              }
            })
          })
          .catch(() => {
            // on cancel
          })
      }
    },
    copy(str) {
      var save = function(e) {
        e.clipboardData.setData('text/plain', str) //下面会说到clipboardData对象
        e.preventDefault() //阻止默认行为
      }
      document.addEventListener('copy', save)
      document.execCommand('copy') //使文档处于可编辑状态，否则无效
    },
    toMapPage(val, needAddress) {
      // console.log('地址---详情页', needAddress)
      const destinationPosition = {
        longitude: val.zqlng,
        latitude: val.zqlat,
        address: val.work_address_street_name,
        FullAddress: val.zq_address
      }
      //弹出复制窗口
      Dialog.alert({
        title: '点击确认复制地址到剪贴板',
        message: `地址：${needAddress}`,
        showCancelButton: true
      })
        .then(() => {
          // on close
          this.copy(needAddress)
        })
        .catch(() => {})
      // todo url里面带有参数对象
      // 路由传参 https://www.jianshu.com/p/d276dcde6656
      // this.$router.push({
      //   path: '/map',
      //   query: {
      //     // 将传递的对象解析为字符串
      //     destinationPosition: JSON.stringify(destinationPosition)
      //   }
      // })
    },
    // toMapPage2(val) {
    //   console.log(val)
    //   const destinationPosition = {
    //     longitude: val.interview_address_lng,
    //     latitude: val.interview_address_lat,
    //     address: val.interview_address_street_name,
    //     FullAddress: val.interview_address_fulle_address
    //   }

    //   // todo url里面带有参数对象
    //   // 路由传参 https://www.jianshu.com/p/d276dcde6656
    //   this.$router.push({
    //     path: '/map',
    //     query: {
    //       // 将传递的对象解析为字符串
    //       destinationPosition: JSON.stringify(destinationPosition)
    //     }
    //   })
    // },
    // toMapPage3(val) {
    //   console.log(val)
    //   const destinationPosition = {
    //     longitude: val.work_address_lng,
    //     latitude: val.work_address_lat,
    //     address: val.work_address_street_name,
    //     FullAddress: val.work_address_fulle_address
    //   }

    //   // todo url里面带有参数对象
    //   // 路由传参 https://www.jianshu.com/p/d276dcde6656
    //   this.$router.push({
    //     path: '/map',
    //     query: {
    //       // 将传递的对象解析为字符串
    //       destinationPosition: JSON.stringify(destinationPosition)
    //     }
    //   })
    // },

    //公司需求页面
    tocompany(id) {
      if (id) {
        this.$router.push({
          path: `/company/${id}`
        })
      } else {
        Toast.fail('请稍等，正在获取数据！')
      }
    },
    // 分享复制链接
    cope() {
      var oInput = document.createElement('input')
      oInput.value = window.location.href
      document.body.appendChild(oInput)
      oInput.select() // 选择对象
      document.execCommand('Copy') // 执行浏览器复制命令
      Toast('复制链接成功')
      // document.execCommand(window.location.href) // 原生调用执行浏览器复制命令
    }
  },

  beforeDestroy() {
    this.needObj = {}
  }
}
</script>

<style lang="scss" scoped>
  .list{
    min-width:200px;
    padding:10px 4px;
    border-bottom:1px solid #ccc;
  }
.job-detail-page {
  width: 100%;
  height: 100%;
  font-size: 12px;
  background-color: #f1f3f4;
  .over_layer {
    margin-top: 46.6px;
    height: 100%;
    .layer {
      width: 40%;
      font-size: 14px;
      position: absolute;
      right: 0;
      z-index: 2;
    }
     .layerLine {
      width: 40%;
      font-size: 14px;
      position: absolute;
      bottom:100px;
      right: 0;
      z-index: 2;
    }

  }
  .detailCard {
    margin: 6px 4px 0 4px;
    background-color: #f1f3f4;
    .swipeImg {
      height: 160px;
      .imgrender {
        vertical-align: bottom;
        width: 100%;
        // image-rendering: -moz-crisp-edges; /* Firefox */
        // image-rendering: -o-crisp-edges; /* Opera */
        // image-rendering: -webkit-optimize-contrast; /* Webkit (non-standard naming) */
        // image-rendering: crisp-edges;    -ms-interpolation-mode: nearest-neighbor;
      }
    }

    .notes_photos {
      padding: 0.26667rem 0.42667rem;
      font-size: 0.37333rem;
      color: #323233;
      line-height: 0.64rem;
      background-color: #ffffff;
      box-sizing: border-box;
      .content_pic {
        text-align: right;
        color: #969799;
      }
    }
    .detailDesc {
      margin-top: 10px;
      .custom-title {
        margin-right: 2px;
        vertical-align: bottom;
      }
    }
    .warn {
      margin: 8px 0;
      background-color: #f4f4f4;
      /*border-top: 1px solid #E6E6E6;*/
      border: 1px solid #e6e6e6;
      padding: 0 8px;
      .title {
        font-size: 14px;
        margin: 10px 0;
        color: red;
        font-weight: bold;
      }
      .content {
        text-indent: 2em;
        line-height: 1.5;
        text-align: justify;
      }
    }
  }
  .detail-footer {
    position: fixed;
    bottom: 0.2px;
    width: 100%;
    display: flex;
    flex-flow: row nowrap;
    align-items: center;
    justify-content: space-between;
    height: 46px;
    background-color: #e5e5e5;
    font-size: 13px;
    text-align: center;
    .all_others {
      .others_items {
        .item {
          display: flex;
          flex-direction: column;
          align-items: center;
          .van-icon {
            font-size: 14px;
          }
        }
      }
      .service {
        width: 20%;
      }
      .collection {
        width: 20%;
      }
      .my_company {
        width: 20%;
      }
      .share {
        width: 20%;
      }
    }
    .signUp {
      color: #ffffff;
      font-size: 16px;
    }
  }
}
.other_serverce{
  padding:10px 50px;
  min-width:150px;
  .title{
    font-size: 16px;
    font-weight: bold;
    width:100%;
    text-align: center;
  }
  .mes_copy{
    width:100%;
    text-align: center;
    margin-top: 50px;
    font-size: 14px;
    .copy{
      margin: 10px 0;
      color:blue;
      width:100%;
    }
  }
}
</style>
